<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html lang="zh">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link rel="icon" href="${pageContext.request.contextPath}/statics/dist/img/favicon-32x32.png" sizes="32x32" type="image/png">
    <link rel="icon" href="${pageContext.request.contextPath}/statics/dist/img/favicon-16x16.png" sizes="16x16" type="image/png">
    <meta name="keywords" content="响应式后台模板,开源免费后台模板,Bootstrap5后台管理系统模板">
    <meta name="description" content="bootstrap-admin基于bootstrap5的免费开源的响应式后台管理模板">
    <meta name="author" content="ajiho">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/statics/lib/bootstrap-icons/font/bootstrap-icons.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/statics/lib/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/statics/dist/css/bootstrap-admin.min.css">
    <title>bootstrap-admin开源免费响应式后台管理系统模板</title>
</head>
<body class="bg-body-tertiary py-3">
<div class="container-fluid">
    <div class="card border-0 shadow-sm">
        <div class="card-body">
            <form id="form">
                <div class="mb-3">
                    <label for="loginName" class="form-label">登录名</label>
                    <input type="text" class="form-control" id="loginName" name="loginName">
                </div>
                <div class="mb-3">
                    <label for="username" class="form-label">用户名</label>
                    <input type="text" class="form-control" id="userName" name="userName">
                </div>
                <div class="mb-3">
                    <label for="password" class="form-label">密码</label>
                    <input type="text" class="form-control" id="password" name="password">
                </div>
                <div class="mb-3">
                    <label for="rePassword" class="form-label">确认密码</label>
                    <input type="text" class="form-control" id="rePassword" name="rePassword">
                </div>
                <div class="mb-3">
                    <label for="gender-1" class="form-label">性别</label>
                    <div>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="sex" checked
                                   id="gender-1" value="0">
                            <label class="form-check-label" for="gender-1">男</label>
                        </div>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="sex"
                                   id="gender-2" value="1">
                            <label class="form-check-label" for="gender-2">女</label>
                        </div>
                    </div>
                </div>
                <div class="mb-3">
                    <label for="phonenumber" class="form-label">手机</label>
                    <input type="text" class="form-control" id="phonenumber" name="phonenumber">
                </div>
                <div class="mb-3">
                    <label for="email" class="form-label">邮箱</label>
                    <input type="text" class="form-control" id="email" name="email">
                </div>
                <button type="submit" class="btn btn-primary">添加</button>
            </form>
        </div>
    </div>


</div>
<!--回到顶部开始-->
<a href="javaScript:" class="bsa-back-to-top"><i class='bi bi-arrow-up-short'></i></a>
<!--回到顶部结束-->


<script src="${pageContext.request.contextPath}/statics/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="${pageContext.request.contextPath}/statics/lib/jquery/dist/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/statics/lib/formvalidation/js/formValidation.js"></script>
<script src="${pageContext.request.contextPath}/statics/lib/formvalidation/js/framework/bootstrap.js"></script>
<script src="${pageContext.request.contextPath}/statics/lib/formvalidation/js/language/zh_CN.js"></script>
<script src="${pageContext.request.contextPath}/statics/dist/js/bootstrap-admin.min.js"></script>
<script src="${pageContext.request.contextPath}/statics/dist/js/app.js"></script>
<!--假数据模拟,生产环境中请直接删除该js-->
<%--<script src="${pageContext.request.contextPath}/statics/dist/js/bootstrap-admin.mock.js"></script>--%>
<script>


    $("#form").formValidation({
        //验证字段
        fields: {
            loginName: {
                validators: {
                    notEmpty: true
                }
            },
            userName: {
                validators: {
                    notEmpty: true
                }
            },
            //...
        }
    }).on('success.form.fv', function (e) {
        //阻止表单提交
        e.preventDefault();
        //得到表单对象
        let $form = $(e.target);
        let data = $form.serialize();


        //得到序列化数据
        $.ajax({
            url: "${pageContext.request.contextPath}/sys/user/add",
            method: 'post',
            data: data,
            success: function (res) {
                if (res.code==200) {
                    //添加成功
                    $.toasts({
                        type: 'success',
                        content: '添加成功',
                        delay:1000,
                        autohide: true,
                        onHidden:function (){
                            parent.modalInstance.setData(true);
                            parent.modalInstance.close();
                        }
                    })
                } else{
                    $.toasts({
                        type: 'success',
                        content: '添加失败',
                        delay:1000,
                        autohide: true

                    })
                }



            }
        })

    });


</script>

</body>
</html>

